<template>
  <div>
    <el-form
      :model="form"
      label-width="130px"
      :rules="rules"
      ref="form"
      style="margin-top: -12px"
    >
      <el-form-item label="价格设置" class="one-label">
        <el-form-item v-show="form.skuFlag == 0" label="供应价：" label-width="170px" prop="supplyPrice">
          <el-input v-model="form.supplyPrice" class="short-input width-per-50" @keyup.native="form.supplyPrice = checkInputNum(form.supplyPrice)"
            placeholder="例如：100" :disabled="updataFlag">
            <template slot="append">元</template>
          </el-input>
        </el-form-item>
        <el-form-item v-show="form.skuFlag == 0 || fromListPage == 31" label="供应商运费：" label-width="170px">
          <el-input v-model="form.supplierPostFee" class="short-input width-per-50" min="0" :disabled="true">
            <template slot="append">元</template>
          </el-input>
        </el-form-item>
        <el-form-item v-show="form.skuFlag == 0 && fromListPage == 30" label="零售价：" label-width="170px" prop="sellPrice">
          <el-input v-model="form.sellPrice" class="short-input width-per-50" @keyup.native="form.sellPrice = checkInputNum(form.sellPrice)" placeholder="例如：100">
            <template slot="append">元</template>
          </el-input>
        </el-form-item>
        <el-form-item v-show="form.skuFlag == 0 && fromListPage == 30 && enterpriseConfig.anchorSelectionAuthority == '1'" label="样品价：" label-width="170px" prop="specimenPrice">
          <el-input v-model="form.specimenPrice" class="short-input width-per-50" @keyup.native="form.specimenPrice = checkInputNum(form.specimenPrice)" placeholder="例如：100">
            <template slot="append">元</template>
          </el-input>
          <div class="tips">填空则主播小程序买样价格按零售价-主播推广佣金计算</div>
        </el-form-item>
        <el-form-item v-show="fromListPage == 31" label="阶梯批发：" label-width="170px">
          <el-switch v-model="form.ladderAuth" active-color="#13ce66" inactive-color="#ff4949" active-value="1" inactive-value="0">
          </el-switch>
          <a :style="{'font-size': '14px', color:ladderPriceList.length > 0 ? '#409eff' : '#999999','text-decoration': 'underline !important' }" @click="ladderAuthClick"  v-if="form.ladderAuth == 1" v-text="ladderPriceList.length > 0 ? '已设置阶梯价' : '未设置阶梯价'"></a>
        </el-form-item>
        <el-form-item v-show="form.ladderAuth == 0 && form.skuFlag == 0 && fromListPage == 31" label="批发价：" label-width="170px" prop="wholesalePrice">
          <el-input v-model="form.wholesalePrice" class="short-input width-per-50" @keyup.native="form.wholesalePrice = checkInputNum(form.wholesalePrice)" placeholder="例如：100">
            <template slot="append">元</template>
          </el-input>
        </el-form-item>
        <el-form-item v-show="fromListPage == 31 && form.ladderAuth == 0" label="起批数量：" label-width="170px" prop="wholesaleNum">
          <el-input v-model="form.wholesaleNum" class="short-input width-per-50" @keyup.native="form.wholesaleNum = checkInputPositiveNum(form.wholesaleNum)"></el-input>
          <div class="tips">起批数量须大于0，设置后不足起批数量无法下单</div>
        </el-form-item>
        <el-form-item v-show="form.skuFlag == 0" label="划线价：" label-width="170px" prop="scribingPrice">
          <el-input v-model="form.scribingPrice" class="short-input width-per-50" @keyup.native="form.scribingPrice = checkInputNum(form.scribingPrice)" placeholder="例如：100">
            <template slot="append">元</template>
          </el-input>
          <div class="tips">划线价在商品详情会以划线形式显示</div>
        </el-form-item>
        <el-form-item v-if=" getVersionType() != 5 && fromListPage == 30 && form.skuFlag == 0" label="运费" class="width-per-50" label-width="170px" prop="postFee">
          <el-input v-model="form.postFee" class="short-input width-per-50" min="0">
            <template slot="append">元</template>
          </el-input>
        </el-form-item>
        <el-form-item v-if="getVersionType() != 5 && fromListPage == 31" label="批发运费" class="width-per-50" label-width="170px" prop="wholesalePostFee">
          <el-input v-model="form.wholesalePostFee" class="short-input width-per-50" min="0">
            <template slot="append">元</template>
          </el-input>
        </el-form-item>
        <el-form-item v-show="form.skuFlag == 1" label="商品规格：" label-width="170px" >
          <div class="table-container pad-t-20 pad-b-20">
            <div class="el-table el-table--fit el-table--border el-table--enable-row-hover el-table--medium el-table--scrollable-x">
              <div class="el-table__body-wrapper">
                <table cellspacing="0" cellpadding="0" border="0" class="el-table__body" style="width: 100%">
                  <thead class="el-table__header">
                    <tr>
                      <th width="135">
                        <div class="cell text-align-c">规格</div>
                      </th>
                      <th width="135">
                        <div class="cell text-align-c">图片</div>
                      </th>
                      <th width="135">
                        <div class="cell text-align-c">
                          <el-popover placement="top" width="160" v-model="visiblePopPrice">
                            <div class="text-align-c pad-b-10">批量设置</div>
                            <el-form label-position="right" style="width: 100%">
                              <el-form-item>
                                <el-input v-model="skuParamSettingValue" @keyup.native=" skuParamSettingValue = checkInputNum(skuParamSettingValue)" type="number"/>
                              </el-form-item>
                            </el-form>
                            <div class="mar-t--10" style="text-align: right">
                              <el-button size="mini" type="text" @click="visiblePopPrice = false">取消</el-button>
                              <el-button type="primary" size="mini" @click="batchUpdateSkuParamPrice">确定</el-button>
                            </div>
                            <label slot="reference" @click="editSkuParam('1')">
                              <span>零售价(元)</span>
                              <i class="el-icon-circle-plus mar-l-10 font-blue"></i>
                            </label>
                          </el-popover>
                        </div>
                      </th>
                      <!-- 样品价 “主播选品”增值功能开启时显示 -->
                      <th width="135" v-if="enterpriseConfig.anchorSelectionAuthority == '1'">
                        <div class="cell text-align-c">
                          <el-popover placement="top" width="160" v-model="visiblePopSpecimenPrice">
                            <div class="text-align-c pad-b-10">批量设置</div>
                            <el-form label-position="right" style="width: 100%">
                              <el-form-item>
                                <el-input v-model="skuParamSettingValue" @keyup.native=" skuParamSettingValue = checkInputNum(skuParamSettingValue)" type="number"/>
                              </el-form-item>
                            </el-form>
                            <div class="mar-t--10" style="text-align: right">
                              <el-button size="mini" type="text" @click="visiblePopSpecimenPrice = false">取消</el-button>
                              <el-button type="primary" size="mini" @click="batchUpdateSkuParamPrice">确定</el-button>
                            </div>
                            <label slot="reference" @click="editSkuParam('10')">
                              <span>样品价(元)</span>
                              <i class="el-icon-circle-plus mar-l-10 font-blue"></i>
                            </label>
                          </el-popover>
                        </div>
                      </th>
                      <th width="135">
                        <div class="cell text-align-c">
                          <el-popover placement="top" width="160" v-model="visiblePopScribingPrice">
                            <div class="text-align-c pad-b-10">批量设置</div>
                            <el-form label-position="right" style="width: 100%">
                              <el-form-item>
                                <el-input v-model="skuParamSettingValue" @keyup.native=" skuParamSettingValue = checkInputNum(skuParamSettingValue)" type="number"/>
                              </el-form-item>
                            </el-form>
                            <div class="mar-t--10" style="text-align: right">
                              <el-button size="mini" type="text" @click="visiblePopScribingPrice = false">取消</el-button>
                              <el-button type="primary" size="mini" @click="batchUpdateSkuParamPrice">确定</el-button>
                            </div>
                            <label slot="reference" @click="editSkuParam('4')">
                              <span>划线价</span>
                              <i class="el-icon-circle-plus mar-l-10 font-blue"></i>
                            </label>
                          </el-popover>
                        </div>
                      </th>
                      <th width="135" v-show="fromListPage == 31">
                        <div class="cell text-align-c">
                          <el-popover placement="top" width="160" v-model="visiblePopWholesalePrice">
                            <div class="text-align-c pad-b-10">批量设置</div>
                            <el-form label-position="right" style="width: 100%">
                              <el-form-item>
                                <el-input v-model="skuParamSettingValue" @keyup.native=" skuParamSettingValue = checkInputNum(skuParamSettingValue)" type="number"/>
                              </el-form-item>
                            </el-form>
                            <div class="mar-t--10" style="text-align: right">
                              <el-button size="mini" type="text" @click="visiblePopWholesalePrice = false">取消</el-button>
                              <el-button type="primary" size="mini" @click="batchUpdateSkuParamPrice">确定</el-button>
                            </div>
                            <label slot="reference" @click="editSkuParam('5')">
                              <span>批发价</span>
                              <i class="el-icon-circle-plus mar-l-10 font-blue"></i>
                            </label>
                          </el-popover>
                        </div>
                      </th>
                      <th width="135">
                        <div class="cell text-align-c">供应价(元)</div>
                      </th>
                      <th width="135">
                        <div class="cell text-align-c">库存</div>
                      </th>
                      <th width="135">
                        <div class="cell text-align-c">
                          <el-popover placement="top" width="160" v-model="visiblePopGoodsBarCode">
                            <div class="text-align-c pad-b-10">批量设置</div>
                            <el-form label-position="right" style="width: 100%">
                              <el-form-item>
                                <el-input v-model="skuParamSettingValue" @keyup.native="skuParamSettingValue = checkInputPositiveNum(skuParamSettingValue)" type="number"/>
                              </el-form-item>
                            </el-form>
                            <div class="mar-t--10" style="text-align: right">
                              <el-button size="mini" type="text" @click="visiblePopGoodsBarCode = false">取消</el-button>
                              <el-button type="primary" size="mini" @click="batchUpdateSkuParamPrice">确定</el-button>
                            </div>
                            <label slot="reference" @click="editSkuParam('6')">
                              <span>条形码</span>
                              <i class="el-icon-circle-plus mar-l-10 font-blue"></i>
                            </label>
                          </el-popover>
                        </div>
                      </th>
                      <th width="135">
                        <div class="cell text-align-c">外部编码</div>
                      </th>
                      <th width="135" v-show="false">
                        <div class="cell text-align-c">预警库存</div>
                      </th>
                    </tr>
                  </thead>
                  <tbody>
                    <tr v-for="(item, index) in form.qualityTable" :key="'info-' + index">
                      <td>
                        <div class="cell">
                          <span>{{item.skuDetail}}</span>
                        </div>
                      </td>
                      <td>
                        <div class="cell text-align-c">
                          <div @click="changeImage(index)">
                            <el-upload list-type="picture-mini" action="/api/common/uploadFiles" accept="image/jpeg,image/gif,image/png,image/bmp" name="files" multiple v-loading="getLoading(index)"
                              :data="token" :show-file-list="false" :on-success="handleUploadSuccess" :before-upload="beforeUpload">
                              <img v-if="item.imageUrl" :src="item.imageUrl" width="42px" height="42px" style="margin-left: -1px; margin-top: -1px"/>
                              <i v-else class="el-icon-plus"></i>
                            </el-upload>
                          </div>
                        </div>
                      </td>
                      <td>
                        <div class="cell">
                          <el-input v-model="item.price" @keyup.native="item.price = checkInputNum(item.price)" placeholder="请输入零售价"></el-input>
                        </div>
                      </td>
                      <td v-if="enterpriseConfig.anchorSelectionAuthority == '1'">
                        <div class="cell">
                          <el-input v-model="item.specimenPrice" @keyup.native="item.specimenPrice = checkInputNum(item.specimenPrice)" placeholder="请输入样品价"></el-input>
                        </div>
                      </td>
                      <td>
                        <div class="cell">
                          <el-input v-model="item.scribingPrice" @keyup.native="item.scribingPrice = checkInputNum(item.scribingPrice)" placeholder="请输入划线价"></el-input>
                        </div>
                      </td>
                      <td v-show="fromListPage == 31">
                        <div class="cell">
                          <el-input v-model="item.wholesalePrice" @keyup.native="item.wholesalePrice = checkInputNum(item.wholesalePrice)" placeholder="请输入批发价"></el-input>
                        </div>
                      </td>
                      <td>
                        <div class="cell">
                          <el-input v-model="item.supplyPrice" placeholder="请输入供应价" :disabled="true"></el-input>
                        </div>
                      </td>
                      <td>
                        <div class="cell">
                          <el-input v-model="item.stock" placeholder="请输入库存" :disabled="true"></el-input>
                        </div>
                      </td>
                      <td>
                        <div class="cell">
                          <el-input v-model="item.goodsBarCode" placeholder="请输入条形码"></el-input>
                        </div>
                      </td>
                      <td>
                        <div class="cell">
                          <el-input v-model="item.externalCode" placeholder="请输入外部编码"></el-input>
                        </div>
                      </td>
                      <td v-show="false">
                        <div class="cell">
                          <el-input v-model="item.warnStock" @keyup.native="item.warnStock = checkInputNum(item.warnStock)" placeholder="请输入预警库存"></el-input>
                        </div>
                      </td>
                    </tr>
                  </tbody>
                </table>
              </div>
            </div>
          </div>
        </el-form-item>
        <div v-show="fromListPage == 30" class="radio-top-bar">
          <el-form-item label="提成佣金：" label-width="170px">
            <div class="tips blue">
              <p>1、实际佣金以比例乘以零售价来计算。</p>
              <p>2、比例和实际佣金将保留小数点后俩位并四舍五入。</p>
              <p>3、若商品为淘宝联盟商品，则提成及佣金是以商品利润（零售价减去供应价后的金额）为基数再按比例计算佣金。</p>
            </div>
            <el-row :gutter="20" class="mar-t-20">
              <el-col :md="24" :lg="12">
                <div class="border-d7">
                  <h3 class="gray-t-bar font-normal font-14 text-align-c mar-b-18">主播佣金设置</h3>
                  <el-form-item label="一级合伙人：" label-width="130px" prop="anchorLevelOnePartnerRatio">
                    <div class="flex v-align-c">
                      <el-input
                        v-model="form.anchorLevelOnePartnerRatio"
                        class="width-per-35"
                        @keyup.native="form.anchorLevelOnePartnerRatio = checkInputNum(form.anchorLevelOnePartnerRatio)">
                        <template slot="append">%</template>
                      </el-input>
                      <div class="pad-l-10">实际佣金：<span class="font-orange-2 font-w">￥{{(((form.sellPrice - form.supplyPrice) * form.anchorLevelOnePartnerRatio / 100) || 0).toFixed(2)}}</span></div>
                    </div>
                    <p class="font-12 font-color-9 mar-0">一级合伙人自己招募或下架合伙人/招募员招募的主播产生的商品返佣</p>
                  </el-form-item>
                  <el-form-item label="二级合伙人：" label-width="130px" prop="anchorLevelTwoPartnerRatio">
                    <div class="flex v-align-c">
                      <el-input
                        v-model="form.anchorLevelTwoPartnerRatio"
                        class="width-per-35"
                        @keyup.native="form.anchorLevelTwoPartnerRatio = checkInputNum(form.anchorLevelTwoPartnerRatio)">
                        <template slot="append">%</template>
                      </el-input>
                      <div class="pad-l-10">实际佣金：<span class="font-orange-2 font-w">￥{{(((form.sellPrice - form.supplyPrice) * form.anchorLevelTwoPartnerRatio / 100) || 0).toFixed(2)}}</span></div>
                    </div>
                    <p class="font-12 font-color-9 mar-0">二级合伙人自己招募或下架招募员招募的主播产生的商品返佣</p>
                  </el-form-item>
                  <el-form-item label="招募员：" label-width="130px" prop="anchorRecruiterRatio">
                    <div class="flex v-align-c">
                      <el-input
                        v-model="form.anchorRecruiterRatio"
                        class="width-per-35"
                        @keyup.native="form.anchorRecruiterRatio = checkInputNum(form.anchorRecruiterRatio)">
                        <template slot="append">%</template>
                      </el-input>
                      <div class="pad-l-10">实际佣金：<span class="font-orange-2 font-w">￥{{(((form.sellPrice - form.supplyPrice) * form.anchorRecruiterRatio / 100) || 0).toFixed(2)}}</span></div>
                    </div>
                    <p class="font-12 font-color-9 mar-0">招募员自己招募的主播产生的商品返佣</p>
                  </el-form-item>
                  <el-form-item label="店铺主播：" label-width="130px" prop="anchorRatio">
                    <div class="flex v-align-c">
                      <el-input
                        v-model="form.anchorRatio"
                        class="width-per-35"
                        @keyup.native="form.anchorRatio = checkInputNum(form.anchorRatio)">
                        <template slot="append">%</template>
                      </el-input>
                      <div class="pad-l-10">实际佣金：<span class="font-orange-2 font-w">￥{{(((form.sellPrice - form.supplyPrice) * form.anchorRatio / 100) || 0).toFixed(2)}}</span></div>
                    </div>
                    <p class="font-12 font-color-9 mar-0">主播在私域微信小程序端带货后获得的佣金</p>
                  </el-form-item>
                  <el-form-item label="平台主播：" label-width="130px" prop="anchorThirdPlatformRatio">
                    <div class="flex v-align-c">
                      <el-input
                        v-model="form.anchorThirdPlatformRatio"
                        class="width-per-35"
                        @keyup.native="form.anchorThirdPlatformRatio = checkInputNum(form.anchorThirdPlatformRatio)">
                        <template slot="append">%</template>
                      </el-input>
                      <div class="pad-l-10">实际佣金：<span class="font-orange-2 font-w">￥{{(((form.sellPrice - form.supplyPrice) * form.anchorThirdPlatformRatio / 100) || 0).toFixed(2)}}</span></div>
                    </div>
                    <p class="font-12 font-color-9 mar-0">主播在公域抖音/快手等平台带货后获得的佣金</p>
                  </el-form-item>
                </div>
              </el-col>
              <el-col :md="24" :lg="12">
                <div class="border-d7">
                  <h3 class="gray-t-bar font-normal font-14 text-align-c mar-b-18">小B佣金设置</h3>
                  <el-form-item label="一级合伙人：" label-width="130px" prop="levelOnePartnerRatio">
                    <div class="flex v-align-c">
                      <el-input
                        v-model="form.levelOnePartnerRatio"
                        class="width-per-35"
                        @keyup.native="form.levelOnePartnerRatio = checkInputNum(form.levelOnePartnerRatio)">
                        <template slot="append">%</template>
                      </el-input>
                      <div class="pad-l-10">实际佣金：<span class="font-orange-2 font-w">￥{{(((form.sellPrice - form.supplyPrice) * form.levelOnePartnerRatio / 100) || 0).toFixed(2)}}</span></div>
                    </div>
                    <p class="font-12 font-color-9 mar-0">一级合伙人自己招募或下架合伙人/招募员招募的店主产生的商品返佣</p>
                  </el-form-item>
                  <el-form-item label="二级合伙人：" label-width="130px" prop="levelTwoPartnerRatio">
                    <div class="flex v-align-c">
                      <el-input
                        v-model="form.levelTwoPartnerRatio"
                        class="width-per-35"
                        @keyup.native="form.levelTwoPartnerRatio = checkInputNum(form.levelTwoPartnerRatio)">
                        <template slot="append">%</template>
                      </el-input>
                      <div class="pad-l-10">实际佣金：<span class="font-orange-2 font-w">￥{{(((form.sellPrice - form.supplyPrice) * form.levelTwoPartnerRatio / 100) || 0).toFixed(2)}}</span></div>
                    </div>
                    <p class="font-12 font-color-9 mar-0">二级合伙人自己招募或下架招募员招募的店主产生的商品返佣</p>
                  </el-form-item>
                  <el-form-item label="招募员：" label-width="130px" prop="recruiterRatio">
                    <div class="flex v-align-c">
                      <el-input
                        v-model="form.recruiterRatio"
                        class="width-per-35"
                        @keyup.native="form.recruiterRatio = checkInputNum(form.recruiterRatio)">
                        <template slot="append">%</template>
                      </el-input>
                      <div class="pad-l-10">实际佣金：<span class="font-orange-2 font-w">￥{{(((form.sellPrice - form.supplyPrice) * form.recruiterRatio / 100) || 0).toFixed(2)}}</span></div>
                    </div>
                    <p class="font-12 font-color-9 mar-0">招募员自己招募的店主产生的商品返佣</p>
                  </el-form-item>
                  <el-form-item label="店主：" label-width="130px" prop="distributeRatio">
                    <div class="flex v-align-c">
                      <el-input
                        v-model="form.distributeRatio"
                        class="width-per-35"
                        @keyup.native="form.distributeRatio = checkInputNum(form.distributeRatio)">
                        <template slot="append">%</template>
                      </el-input>
                      <div class="pad-l-10 height-40 mar-t--16">
                        <div class="line-h-unset height-20 mar-b-1">
                          实际佣金：<span class="font-orange-2 font-w line-h-unset">￥{{(((form.sellPrice - form.supplyPrice) * form.distributeRatio / 100) || 0).toFixed(2)}}</span>
                        </div>
                        <div class="line-h-unset height-20">
                          <span class="font-blue-2 font-under cursor-p line-h-unset" @click="gradeClick">设置等级佣金</span>
                          <span class="font-color-9 line-h-unset">{{ gradeFlage ? '（已开启）' : '（已关闭）' }}</span>
                        </div>
                      </div>
                    </div>
                    <p class="font-12 font-color-9 mar-0">店主的店铺卖出该商品后获得的佣金</p>
                  </el-form-item>
                  <el-form-item label="顾客分销商：" label-width="130px" prop="shareMemberRatio">
                    <div class="flex v-align-c">
                      <el-input
                        v-model="form.shareMemberRatio"
                        class="width-per-35"
                        @keyup.native="form.shareMemberRatio = checkInputNum(form.shareMemberRatio)">
                        <template slot="append">%</template>
                      </el-input>
                      <div class="pad-l-10">实际佣金：<span class="font-orange-2 font-w">￥{{(((form.sellPrice - form.supplyPrice) * form.shareMemberRatio / 100) || 0).toFixed(2)}}</span></div>
                    </div>
                    <p class="font-12 font-color-9 mar-0">顾客分销该商品后获得的返佣</p>
                  </el-form-item>
                </div>
              </el-col>
            </el-row>
          </el-form-item>
          <!-- 原代码 -->
          <!-- <el-form-item label="提成佣金：" label-width="170px" v-if="getVersionType() == 1 || getVersionType() == 4">
            <el-radio-group v-model="form.distributeType" @change="distributeTypeChange">
              <el-radio class="gray-active" :label="1" :class="1 === form.distributeType ? 'active' : ''">按比例(%)</el-radio>
              <el-radio class="gray-active" :label="2" :class="2 === form.distributeType ? 'active' : ''">按金额(元)</el-radio>
            </el-radio-group>
            <div class="gray-bar default-input">
              <el-row>
                <template v-if="enterpriseConfig.partnerAuthority == 1">
                  <el-col :span="4" class="align-l">
                    <el-input v-if="form.distributeType == '1'" v-model="form.levelOnePartnerRatio" class="long-input" @keyup.native="form.levelOnePartnerRatio = checkInputNum(form.levelOnePartnerRatio)">
                    </el-input>
                    <el-input v-if="form.distributeType == '2'" v-model="form.levelOnePartnerFee" class="long-input" @keyup.native="form.levelOnePartnerFee = checkInputNum(form.levelOnePartnerFee)">
                    </el-input>
                  </el-col>
                  <el-col :span="4" class="align-l mar-l--20">
                    <el-input v-if="form.distributeType == '1'" v-model="form.levelTwoPartnerRatio" class="long-input" @keyup.native="form.levelTwoPartnerRatio = checkInputNum(form.levelTwoPartnerRatio)">
                    </el-input>
                    <el-input v-if="form.distributeType == '2'" v-model="form.levelTwoPartnerFee" class="long-input" @keyup.native="form.levelTwoPartnerFee = checkInputNum(form.levelTwoPartnerFee)">
                    </el-input>
                  </el-col>
                </template>
                <el-col :span="4" class="align-l mar-l--20">
                  <el-input v-if="form.distributeType == '1'" v-model="form.recruiterRatio" class="long-input" @keyup.native="form.recruiterRatio = checkInputNum(form.recruiterRatio)">
                  </el-input>
                  <el-input v-if="form.distributeType == '2'" v-model="form.recruiterFee" class="long-input" @keyup.native=" form.recruiterFee = checkInputNum(form.recruiterFee)">
                  </el-input>
                </el-col>
                <el-col :span="4" class="align-l mar-l--20">
                  <el-input v-if="form.distributeType == '1'" v-model="form.distributeRatio" class="long-input" @keyup.native="form.distributeRatio = checkInputNum(form.distributeRatio)">
                  </el-input>
                  <el-input v-if="form.distributeType == '2'" v-model="form.distributeFee" class="long-input" @keyup.native=" form.distributeFee = checkInputNum(form.distributeFee)">
                  </el-input>
                </el-col>
                <el-col :span="4" class="align-l mar-l--20">
                  <el-input v-if="form.distributeType == '1'" v-model="form.shareMemberRatio" class="long-input" @keyup.native="form.shareMemberRatio = checkInputNum(form.shareMemberRatio)">
                  </el-input>
                  <el-input v-if="form.distributeType == '2'" v-model="form.shareMemberFee" class="long-input" @keyup.native="form.shareMemberFee = checkInputNum(form.shareMemberFee)">
                  </el-input>
                </el-col>
                <el-col :span="4" class="align-l mar-l--20">
                  <el-input v-if="form.distributeType == '1'" v-model="form.anchorRatio" class="long-input" @keyup.native="form.anchorRatio = checkInputNum(form.anchorRatio)">
                  </el-input>
                  <el-input v-if="form.distributeType == '2'" v-model="form.anchorCommission" class="long-input" @keyup.native="form.anchorCommission = checkInputNum(form.anchorCommission)">
                  </el-input>
                </el-col>
              </el-row>
              <el-row>
                <template v-if="enterpriseConfig.partnerAuthority == 1">
                  <el-col :span="4" class="align-l pad-r-20">
                    <el-tooltip class="item" effect="dark" content="一级合伙人按商品分润获得的提成" placement="top">
                      <span>一级合伙人提成</span>
                    </el-tooltip>
                  </el-col>
                  <el-col :span="4" class="align-l mar-l--20 pad-r-20">
                    <el-tooltip class="item" effect="dark" content="二级合伙人按商品分润获得的提成" placement="top">
                      <span>二级合伙人提成</span>
                    </el-tooltip>
                  </el-col>
                </template>
                <el-col :span="4" class="align-l mar-l--20 pad-r-20">
                  <el-tooltip class="item" effect="dark" content="招募员按商品分润获得的提成" placement="top">
                    <span>招募员提成</span>
                  </el-tooltip>
                </el-col>
                <el-col :span="4" class="align-l mar-l--20 pad-r-20">
                  <el-tooltip class="item" effect="dark" content="开通萤火云店的店主分销商品后获得的佣金" placement="top">
                    <span>店主佣金</span>
                  </el-tooltip>
                  <el-button type="text" @click="gradeClick">设置等级佣金</el-button>
                </el-col>
                <el-col :span="4" class="align-l mar-l--20 pad-r-20">
                  <el-tooltip class="item" effect="dark" content="顾客帮店主分销商品后获得的佣金（仅限一级）" placement="top">
                    <span>顾客分销佣金</span>
                  </el-tooltip>
                </el-col>
                <el-col :span="4" class="align-l mar-l--20 pad-r-20">
                  <el-tooltip class="item" effect="dark" content="直播间产生的订单，主播获得的佣金（仅作为备注记录）" placement="top">
                    <span>主播推广佣金</span>
                  </el-tooltip>
                </el-col>
              </el-row>
              <span style="color: #999; font-size: 12px">温馨提示: 当前商品为淘宝联盟商品，提成及佣金以商品利润（零售价减去供应价后的金额）为基数进行分配</span>
            </div>
          </el-form-item>
          <el-form-item label="提成佣金：" label-width="170px" v-if="getVersionType() == 5">
            <el-radio-group v-model="form.distributeType">
              <el-radio class="gray-active" :label="1" :class="1 === form.distributeType ? 'active' : ''">按比例(%)</el-radio>
              <el-radio class="gray-active" :label="2" :class="2 === form.distributeType ? 'active' : ''" >按金额(元)</el-radio>
            </el-radio-group>
            <div class="gray-bar default-input">
              <el-row>
                <el-col :span="6" class="align-r pad-r-10">团长佣金：</el-col>
                <el-col :span="18">
                  <el-form-item style="background: #e4e4e4" v-if="form.distributeType == '1'" label="" prop="distributeRatio">
                    <el-input v-model="form.distributeRatio" class="long-input" @keyup.native="form.distributeRatio = checkInputNum(form.distributeRatio)">
                    </el-input>
                  </el-form-item>
                  <el-form-item v-show="form.distributeType == '2'" label="" prop="distributeFee" style="background-color: rgb(228, 228, 228)">
                    <el-input v-model="form.distributeFee" class="long-input" @keyup.native="form.distributeFee = checkInputNum(form.distributeFee)">
                    </el-input>
                  </el-form-item>
                </el-col>
              </el-row>
            </div>
          </el-form-item> -->
        </div>
      </el-form-item>
    </el-form>

    <!-- 阶梯批发设置 -->
    <el-dialog title="设置阶梯价" :visible.sync="ladderAuthFlag" :close-on-press-escape="true" width="850px">
      <div class="table-container pad-t-20 pad-b-20">
        <div class="el-table el-table--fit el-table--border el-table--enable-row-hover el-table--medium el-table--scrollable-x">
          <div class="el-table__body-wrapper">
            <table cellspacing="0" cellpadding="0" border="0" class="el-table__body" style="width: 100%">
              <thead class="el-table__header">
              <tr>
                <th width="50"><div class="cell text-align-c">序号</div></th>
                <th width="135">
                  <div class="cell text-align-c">购买数量</div>
                </th>
                <th width="135">
                  <div class="cell text-align-c">批发价</div>
                </th>
                <th width="135"><div class="cell text-align-c">预览</div></th>
                <th width="50"><div class="cell text-align-c">操作</div></th>
              </tr>
              </thead>
              <tbody>
              <tr v-for="(item, index) in ladderPriceList" :key="'info-' + index">
                <td>
                  <div class="cell">
                    <span>{{ index }}</span>
                  </div>
                </td>
                <td>
                  <div class="cell">
                    <el-input v-model="item.ladderNum" type="number" :min="1" placeholder="请输入购买数量"></el-input>
                  </div>
                </td>
                <td>
                  <div class="cell">
                    <el-input v-model="item.ladderPrice" type="number" :min="0" placeholder="请输入阶梯价"></el-input>
                  </div>
                </td>
                <td>
                  <div class="cell">
                    <template v-if="index == 0">
                      1 ~ {{ item.ladderNum }}件 : <span v-if="item.ladderPrice">{{item.ladderPrice}}元/件</span>
                    </template>
                    <template v-else>
                      {{Number(ladderPriceList[index - 1].ladderNum) + 1}} ~ {{ item.ladderNum }}件 : <span v-if="item.ladderPrice">{{item.ladderPrice}}元/件</span>
                    </template>
                  </div>
                </td>
                <td>
                  <div class="cell">
                    <el-button type="text" @click="delLadderPrice(index)">删除</el-button>
                  </div>
                </td>
              </tr>
              </tbody>
            </table>
            <el-button type="text" @click="addLadderPrice" v-if="ladderPriceList.length < 5">+新增一规则(最多添加5条)</el-button>
          </div>
        </div>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button @click="ladderAuthFlag = false">关闭</el-button>
        <el-button type="primary" @click="saveLadderPrice">保存</el-button>
      </div>
    </el-dialog>
    <!--等级佣金-->
    <el-dialog title="设置店主等级佣金" :visible.sync="gradeVisible" :close-on-press-escape="true" width="460px">
      <div class="pad-b-10">
        <el-switch class="pad-l-10" v-model="gradeFlage" active-color="#13ce66" inactive-color="#ff4949"></el-switch>
        <span v-if="!gradeFlage">禁用店主佣金等级</span>
        <span v-if="gradeFlage">启用店主佣金等级</span>
        <el-button type="text" class="pad-l-30" @click="copyCommission" v-if="form.distributeType == 1">复制等级默认佣金比例</el-button>
      </div>
      <el-table :data="gradeList" style="width: 100%">
        <el-table-column prop="gradeName" label="店主等级"></el-table-column>
        <el-table-column label="佣金">
          <template slot-scope="scope">
            <el-input v-model="scope.row.commissionRate" placeholder="请输入佣金" @keyup.native="scope.row.commissionRate = checkInputNum(scope.row.commissionRate)">
              <template slot="append" v-if="form.distributeType == 1">%</template>
            </el-input>
          </template>
        </el-table-column>
      </el-table>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="saveGrade">确定</el-button>
        <el-button @click="gradeVisible = false">取消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import elDragDialog from '@/directive/el-dragDialog' // base on element-ui
import { getToken } from '@/utils/auth'
import { listCategorySku } from '@/api/goods/goods'
import { listGoodsGrade } from '@/api/goods/goodsMemberGrade'
export default {
  directives: {
    // 拖动窗口
    elDragDialog
  },
  props: {
    dict: { type: Object },
    fromListPage: { type: Number, default: 30 }
  },
  data() {
    return {
      activeName: '1',
      flagBoolean: false,
      gradeVisible: false,
      gradeFlage: false,
      gradeList: [],
      ladderAuthFlag: false,
      updataFlag: false,
      tabDisabled: true,
      stockBoolean: false,
      token: '',
      fileLoading: false,
      loadingTotal: '0',
      showSingle: 1,
      ladderPriceList: [],
      form: {
        ladderAuth: '0',
        skuFlag: '0',
        sellPrice: '',
        distributeType: 1,
        distributeRatio: '',
        distributeFee: '',
        shareMemberRatio: '',
        shareMemberFee: '',
        levelOnePartnerRatio: '',
        levelOnePartnerFee: '',
        levelTwoPartnerRatio: '',
        levelTwoPartnerFee: '',
        recruiterRatio: '',
        recruiterFee: '',
        anchorRatio: '',
        anchorCommission: '',
        // 样品价
        specimenPrice: '',
        stock: '',
        stockWarn: '',
        supplyPrice: '',
        scribingPrice: '',
        wholesalePrice: '',
        goodsBarCode: '',
        externalCode: '',
        wholesaleNum: '',
        postFee: '',
        wholesalePostFee: '',
        supplierPostFee: '',
        ladderType: '0',
        ladderPriceList: [],
        singleTable: [],
        qualityTable: [],
        dataTable: []
      },
      ids: [],
      imageIndex: '',
      fileChangeFlag: '0',
      editSkuParamSettingVisible: false,
      skuParamSettingValue: '',
      skuParamSettingLabel: '',
      skuParamSettingTitle: '批量修改SKU零售价',
      skuParamSettingType: '',
      visiblePopPrice: false,
      visiblePopSpecimenPrice: false,
      visiblePopScribingPrice: false,
      visiblePopWholesalePrice: false,
      visiblePopSupplyPrice: false,
      visiblePopStock: false,
      visiblePopGoodsBarCode: false,
      visiblePopExternalCode: false,
      rules: {
        sellPrice: [
          { max: 14, message: '零售价格长度最多输入 14 个字符' },
          { required: false, message: '请填写商品零售价', trigger: 'blur' },
          {
            pattern: /(^[1-9](\d+)?(\.\d{1,2})?$)|(^0$)|(^\d\.\d{1,2}$)/,
            message: '请填写正确金额'
          }
        ],
        postFee: [
          { max: 14, message: '运费最多输入14 个字符' },
          { required: true, message: '请填写运费', trigger: 'blur' },
          {
            pattern: /(^[1-9](\d+)?(\.\d{1,2})?$)|(^0$)|(^\d\.\d{1,2}$)/,
            message: '请正确输入运费'
          }
        ],
        wholesalePostFee: [
          { max: 14, message: '运费最多输入14 个字符' },
          { required: true, message: '请填写运费', trigger: 'blur' },
          {
            pattern: /(^[1-9](\d+)?(\.\d{1,2})?$)|(^0$)|(^\d\.\d{1,2}$)/,
            message: '请正确输入运费'
          }
        ],
        supplierPostFee: [
          { max: 14, message: '邮费最多输入14 个字符' },
          { required: true, message: '请填写运费', trigger: 'blur' },
          {
            pattern: /(^[1-9](\d+)?(\.\d{1,2})?$)|(^0$)|(^\d\.\d{1,2}$)/,
            message: '请正确输入邮费'
          }
        ],
        wholesalePrice: [
          { max: 14, message: '批发价价格长度最多输入 14 个字符' },
          { required: false, message: '请填写商品批发价', trigger: 'blur' },
          {
            pattern: /(^[1-9](\d+)?(\.\d{1,2})?$)|(^0$)|(^\d\.\d{1,2}$)/,
            message: '请填写正确金额'
          }
        ],
        scribingPrice: [
          { max: 14, message: '划线价格长度最多输入 14 个字符' },
          { required: false, message: '请正确输入划线价格', trigger: 'blur' },
          {
            pattern: /(^[1-9](\d+)?(\.\d{1,2})?$)|(^0$)|(^\d\.\d{1,2}$)/,
            message: '请填写正确金额'
          }
        ],
        distributeRatio: [
          { required: false },
          {
            pattern: /(^(\d|[1-9]\d)(\.\d{1,2})?$)/,
            message: '请填写正确分销比例'
          }
        ],
        distributeFee: [
          { max: 14, message: '微客佣金最多输入14个字符' },
          { required: false, message: '请输入微客分销佣金', trigger: 'blur' },
          {
            pattern: /(^[1-9](\d+)?(\.\d{1,2})?$)|(^0$)|(^\d\.\d{1,2}$)/,
            message: '请正确输入微客分销佣金'
          }
        ],
        supplyPrice: [
          { max: 14, message: '供应价最多输入14个字符' },
          { required: false, message: '请输入供应价', trigger: 'blur' },
          {
            pattern: /(^[1-9](\d+)?(\.\d{1,2})?$)|(^0$)|(^\d\.\d{1,2}$)/,
            message: '请正确输入供应价'
          }
        ]
      },
      categoryId: '',
      categorySkuList: [],
      tempList: [],
      enterpriseConfig: {
        partnerAuthority: 0
      }
    }
  },
  computed: {
  },
  // 初始化页面
  created() {
    this.token = { accessToken: getToken() }
    this.initGoodsEdit()
  },
  mounted() {
    const that = this
    this.$bus.$on('goods_supplier.stockBoolean', function(stockBoolean) {
      that.stockBoolean = stockBoolean
    })
    this.$bus.$on('goods.edit.categoryId', function(categoryId) {
      that.categoryId = categoryId
      that.categoryChange()
    })
    this.$bus.$on('skuFlag', function(flag) {
      that.form.skuFlag = flag
    })
  },
  watch: {
    tempList(newVal) {
      for (const tag of this.categorySkuList) {
        tag.disabled = false
      }
      for (const tempitem of newVal) {
        for (const listitem of this.categorySkuList) {
          if (listitem.skuPropName === tempitem) {
            listitem.disabled = true
          }
        }
      }
    }
  },
  methods: {
    gradeClick() {
      if (this.form.memberGradeAuth === 0) {
        this.gradeFlage = false
      } else {
        this.gradeFlage = true
      }
      if (this.gradeList.length === 0) {
        listGoodsGrade(this.getEnterpriseId(), this.form.goodsId, this.form.distributeType).then(response => {
          if (response.isError) return
          this.gradeList = response.data
          this.gradeVisible = true
        })
      } else {
        this.gradeVisible = true
      }
    },
    distributeTypeChange() {
      this.gradeList = []
    },
    copyCommission() {
      this.gradeList.forEach(item => {
        this.$set(item, 'commissionRate', item.defaultCommissionRate)
      })
    },
    saveGrade() {
      if (this.gradeFlage) {
        this.form.memberGradeAuth = 1
      } else {
        this.form.memberGradeAuth = 0
      }
      if (this.gradeList.length === 0 && this.gradeFlage) {
        this.$message.error('请先设置店主等级')
        return
      }
      let flag = 0
      let flag1 = 0
      this.gradeList.forEach(item => {
        if (item.commissionRate * 1 > 100) {
          flag = 1
          return
        }
        if (item.commissionRate === '' || item.commissionRate === undefined) {
          flag1 = 1
          return
        }
      })
      if (flag === 1) {
        this.$message.error('佣金比例不能大于100')
        return
      }
      if (flag1 === 1) {
        this.$message.error('佣金不能为空')
        return
      }
      this.form.gradeList = this.gradeList
      this.gradeVisible = false
    },
    changeSelect(e) {
      this.tempList = []
      for (const item of this.form.qualityData) {
        if (item.categoryId !== '') {
          this.tempList.push(item.categoryId)
        }
      }
    },
    addSku() {
      this.$prompt('请输入规格', '', {
        confirmButtonText: '确定',
        cancelButtonText: '取消'
      })
        .then(({ value }) => {
          const date = {
            skuPropName: value
          }
          this.categorySkuList.push(date)
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '取消输入'
          })
        })
    },
    // 删除一级规格
    removeQta(item, index) {
      if (this.form.qualityData.length > 1) {
        this.$confirm('此操作将删除该规格，是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.form.qualityData.splice(index, 1)
          this.tempList.splice(index, 1)
        })
      }
    },
    editSkuParam(type) {
      this.skuParamSettingType = type
      this.skuParamSettingValue = ''
      if (type === '1') {
        this.skuParamSettingLabel = '零售价'
        this.skuParamSettingTitle = '批量修改SKU零售价'
      } else if (type === '2') {
        this.skuParamSettingLabel = '库存'
        this.skuParamSettingTitle = '批量修改SKU库存'
      } else if (type === '3') {
        this.skuParamSettingLabel = '供应价'
        this.skuParamSettingTitle = '批量修改SKU供应价'
      }
    },
    // 数列展示
    categoryChange() {
      listCategorySku(this.categoryId).then((response) => {
        if (response.isError) return
        this.categorySkuList = response.data
      })
    },
    // 批量更新sku价格，库存
    batchUpdateSkuParamPrice() {
      console.log('batchUpdateSkuParamPrice')
      const paramValue = this.skuParamSettingValue
      const skuParamSettingType = this.skuParamSettingType
      const qualityTable = this.form.qualityTable
      for (let i = 0; i < qualityTable.length; i++) {
        if (skuParamSettingType === '1') {
          this.visiblePopPrice = false
          this.$set(this.form.qualityTable[i], 'price', paramValue)
        } else if (skuParamSettingType === '3') {
          this.visiblePopSupplyPrice = false
          this.$set(this.form.qualityTable[i], 'supplyPrice', paramValue)
        } else if (skuParamSettingType === '4') {
          this.visiblePopScribingPrice = false
          this.$set(this.form.qualityTable[i], 'scribingPrice', paramValue)
        } else if (skuParamSettingType === '5') {
          this.visiblePopWholesalePrice = false
          this.$set(this.form.qualityTable[i], 'wholesalePrice', paramValue)
        } else if (skuParamSettingType === '6') {
          this.visiblePopGoodsBarCode = false
          this.$set(this.form.qualityTable[i], 'goodsBarCode', paramValue)
        } else if (skuParamSettingType === '2') {
          this.visiblePopStock = false
          this.$set(this.form.qualityTable[i], 'stock', paramValue)
        } else if (skuParamSettingType === '10') {
          // 样品价
          this.visiblePopSpecimenPrice = false
          this.$set(this.form.qualityTable[i], 'specimenPrice', paramValue)
        }
      }
      this.editSkuParamSettingVisible = false
    },
    getID(length) {
      const ids = this.ids
      const id = -parseInt(Math.round(Math.random() * 100000000))
      if (ids.indexOf(id) > 0) {
        this.getID()
      } else {
        ids.push(id)
        this.ids = ids
        return id
      }
    },
    changeImage(index) {
      this.imageIndex = index
    },
    beforeUpload(file) {
      this.fileChangeFlag = '0'
      const isJPG = file.type === 'image/jpeg'
      const isGIF = file.type === 'image/gif'
      const isPNG = file.type === 'image/png'
      const isBMP = file.type === 'image/bmp'

      if (!isJPG && !isGIF && !isPNG && !isBMP) {
        this.$message.error('上传图片必须是JPG/GIF/PNG/BMP 格式!')
      }
      this.fileLoading = true
      return isJPG || isBMP || isGIF || isPNG
    },
    getLoading(index) {
      const that = this
      if (that.loadingTotal === '1' && this.imageIndex === index) {
        return true
      } else {
        return false
      }
    },
    handleUploadSuccess(res, file) {
      this.loadingTotal = '0'
      if (res.code === 101) {
        const qualityData = this.form.qualityData
        if (qualityData.length === 1) {
          const singleTable = this.form.singleTable
          for (let i = 0; i < singleTable.length; i++) {
            const imageIndex = this.imageIndex
            if (imageIndex * 1 === i) {
              singleTable[i].imageUrl = res.data[0]
            }
          }
        } else {
          const imageIndex = this.imageIndex
          const qualityTable = this.form.qualityTable
          for (let i = 0; i < qualityTable.length; i++) {
            if (imageIndex * 1 === i) {
              qualityTable[i].imageUrl = res.data[0]
            }
          }
        }
      } else {
        this.$message({
          type: 'error',
          message: res.msg
        })
        return false
      }
      this.$forceUpdate()
    },
    initGoodsEdit() {
      const that = this
      this.$bus.$on('goods.edit.data', function(data) {
        that.form.goodsId = data.goodsId
        if (data.goodsId) {
          that.flagBoolean = true
        }
        if (data.goodsSource === 0) {
          that.updataFlag = false
        } else {
          that.updataFlag = true
        }
        if (data.qualityTable) {
          that.form.qualityTable = data.qualityTable
        }
        that.form.memberGradeAuth = data.memberGradeAuth
        if (that.getVersionType() * 1 === 5) {
          // 社区版，供应商价格可编辑
          that.updataFlag = false
        }
        const skuFlag = that.$utils.isExist(data.skuFlag)
          ? data.skuFlag + ''
          : '0'
        that.form.skuFlag = skuFlag
        that.form.supplierPostFee = that.$utils.isExist(data.supplierPostFee)
          ? data.supplierPostFee
          : '0'
        that.form.postFee = that.$utils.isExist(data.postFee)
          ? data.postFee
          : '0'
        that.form.wholesalePostFee = that.$utils.isExist(data.wholesalePostFee)
          ? data.wholesalePostFee
          : '0'
        that.form.sellPrice = that.$utils.isExist(data.sellPrice)
          ? data.sellPrice
          : ''
        that.form.distributeRatio = that.$utils.isExist(data.distributeRatio)
          ? data.distributeRatio + ''
          : ''
        that.form.stock = that.$utils.isExist(data.stock) ? data.stock + '' : ''
        that.form.stockWarn = that.$utils.isExist(data.stockWarn)
          ? data.stockWarn + ''
          : ''
        that.form.distributeType = that.$utils.isExist(data.distributeType)
          ? data.distributeType
          : 1
        that.form.distributeRatio = that.$utils.isExist(data.distributeRatio)
          ? data.distributeRatio + ''
          : ''
        that.form.distributeFee = that.$utils.isExist(data.distributeFee)
          ? data.distributeFee
          : ''
        that.form.shareMemberRatio = that.$utils.isExist(data.shareMemberRatio)
          ? data.shareMemberRatio + ''
          : ''
        that.form.shareMemberFee = that.$utils.isExist(data.shareMemberFee)
          ? data.shareMemberFee
          : ''
        that.form.anchorRatio = that.$utils.isExist(data.anchorRatio)
          ? data.anchorRatio + ''
          : ''
        that.form.anchorCommission = that.$utils.isExist(data.anchorCommission)
          ? data.anchorCommission
          : ''
        that.form.levelOnePartnerRatio = that.$utils.isExist(
          data.levelOnePartnerRatio
        )
          ? data.levelOnePartnerRatio + ''
          : ''
        that.form.levelOnePartnerFee = that.$utils.isExist(
          data.levelOnePartnerFee
        )
          ? data.levelOnePartnerFee
          : ''
        that.form.levelTwoPartnerRatio = that.$utils.isExist(
          data.levelTwoPartnerRatio
        )
          ? data.levelTwoPartnerRatio + ''
          : ''
        that.form.levelTwoPartnerFee = that.$utils.isExist(
          data.levelTwoPartnerFee
        )
          ? data.levelTwoPartnerFee
          : ''
        that.form.recruiterRatio = that.$utils.isExist(data.recruiterRatio)
          ? data.recruiterRatio + ''
          : ''
        that.form.recruiterFee = that.$utils.isExist(data.recruiterFee)
          ? data.recruiterFee
          : ''
        that.form.supplyPrice = that.$utils.isExist(data.supplyPrice)
          ? data.supplyPrice + ''
          : '0'
        that.form.scribingPrice = that.$utils.isExist(data.scribingPrice)
          ? data.scribingPrice + ''
          : ''
        that.form.wholesalePrice = that.$utils.isExist(data.wholesalePrice)
          ? data.wholesalePrice + ''
          : ''
        that.form.goodsBarCode = that.$utils.isExist(data.goodsBarCode)
          ? data.goodsBarCode + ''
          : ''
        that.form.externalCode = that.$utils.isExist(data.externalCode)
          ? data.externalCode + ''
          : ''
        that.form.wholesaleNum = that.$utils.isExist(data.wholesaleNum)
          ? data.wholesaleNum + ''
          : ''
        that.form.ladderAuth = that.$utils.isExist(data.ladderAuth) ? data.ladderAuth + '' : ''
        // 样品价
        that.form.specimenPrice = that.$utils.isExist(data.specimenPrice) ? data.specimenPrice : ''
        that.ladderPriceList = data.ladderPriceList
      })
    },
    ladderAuthClick() {
      this.ladderAuthFlag = true
    },
    addLadderPrice() {
      this.ladderPriceList.push({})
    },
    delLadderPrice(subIndex) {
      if (this.ladderPriceList && this.ladderPriceList.length > 1) {
        this.ladderPriceList.splice(subIndex, 1)
      }
    },
    saveLadderPrice() {
      // 校验阶梯价
      if (this.ladderPriceList && this.ladderPriceList.length > 0) {
        if (!Number(this.ladderPriceList[0].ladderNum) > 0) {
          this.$message({
            type: 'error',
            message: '购买数量要大于0'
          })
          return
        }
        if (!parseFloat(this.ladderPriceList[0].ladderPrice) > 0) {
          this.$message({
            type: 'error',
            message: '批发价要大于0'
          })
          return
        }
      }
      if (this.ladderPriceList && this.ladderPriceList.length > 1) {
        for (let i = 0; i < this.ladderPriceList.length - 1; i++) {
          if (!Number(this.ladderPriceList[i + 1].ladderNum) > 0) {
            this.$message({
              type: 'error',
              message: '购买数量要大于0'
            })
            return
          }
          if (!parseFloat(this.ladderPriceList[i + 1].ladderPrice) > 0) {
            this.$message({
              type: 'error',
              message: '批发价要大于0'
            })
            return
          }
          if (Number(this.ladderPriceList[i].ladderNum) >= Number(this.ladderPriceList[i + 1].ladderNum)) {
            this.$message({
              type: 'error',
              message: '购买数量要大于上一级阶梯'
            })
            return
          }
          if (parseFloat(this.ladderPriceList[i].ladderPrice) <= parseFloat(this.ladderPriceList[i + 1].ladderPrice)) {
            this.$message({
              type: 'error',
              message: '批发价要小于上一级阶梯'
            })
            return
          }
        }
      }
      this.form.ladderPriceList = JSON.parse(
        JSON.stringify(this.ladderPriceList)
      )
      this.ladderAuthFlag = false
    },
    checkForm() {
      const distributeType = this.form.distributeType
      const sellPrice = this.form.sellPrice
      const skuFlag = this.form.skuFlag
      // 需要校验的集合
      const checkArrays = []
      if (this.fromListPage === 30) {
        checkArrays.push('postFee')
      }
      if (this.fromListPage === 31) {
        checkArrays.push('wholesalePostFee')
      }
      checkArrays.push('supplierPostFee')
      if (distributeType === 1) {
        checkArrays.push('distributeRatio')
      } else if (distributeType === 2) {
        checkArrays.push('distributeFee')
      }
      checkArrays.push('scribingPrice')
      // checkArrays.push('unrealSalesNum')
      checkArrays.push('stockWarn')
      let ret = true
      let message = ''
      this.$refs.form.validateField(checkArrays, (valid) => {
        if (valid !== '') {
          message = valid
          ret = false
          return false
        }
      })
      if (!ret) {
        this.$message({
          type: 'error',
          message: message
        })
        return false
      }
      if (this.fromListPage === 31 && !this.form.wholesaleNum && this.form.ladderAuth === '0') {
        this.$message({
          type: 'error',
          message: '起批数不能为空'
        })
        return false
      }
      if (skuFlag === '0') {
        if (this.fromListPage === 31 && !this.form.wholesalePrice && this.form.ladderAuth === '0') {
          this.$message({
            type: 'error',
            message: '批发价不能为空'
          })
          return false
        }
        if (this.fromListPage === 31 && this.form.wholesalePrice * 1 <= 0 && this.form.ladderAuth === '0') {
          this.$message({
            type: 'error',
            message: '批发价不能小于等于0'
          })
          return false
        }
        if (
          distributeType === 2 &&
          this.form.distributeFee &&
          this.form.distributeFee * 1 >= sellPrice * 1 &&
          this.fromListPage === 30
        ) {
          this.$message({
            type: 'error',
            message: '微客佣金不能大于商品金额'
          })
          return false
        }
        if (this.stockBoolean === true && this.form.supplyPrice === '') {
          this.$message({
            type: 'error',
            message: '供应价不能为空'
          })
          return false
        }
        if (distributeType === 2) {
          const distributeFee = !this.form.distributeFee
            ? 0
            : this.form.distributeFee * 1
          if (distributeFee > sellPrice * 1) {
            this.$message({
              type: 'error',
              message: '微客佣金不能大于商品金额'
            })
            return false
          }
          const shareMemberFee = !this.form.shareMemberFee
            ? 0
            : this.form.shareMemberFee * 1
          if (shareMemberFee > sellPrice * 1) {
            this.$message({
              type: 'error',
              message: '微客佣金不能大于商品金额'
            })
            return false
          }
          if (distributeFee + shareMemberFee > sellPrice * 1) {
            this.$message({
              type: 'error',
              message: '微客佣金+顾客分销佣金不能大于商品金额'
            })
            return false
          }
        }
      } else {
        let total1 = 0
        if (distributeType === 2) {
          const distributeFee = this.form.distributeFee
          total1 = distributeFee == null ? 0 : distributeFee
        }
        let stockTotal = 0
        for (let i = 0; i < this.form.qualityTable.length; i++) {
          const price = this.form.qualityTable[i].price
          const wholesalePrice = this.form.qualityTable[i].wholesalePrice
          const stock = this.form.qualityTable[i].stock
          const warnStock = this.form.qualityTable[i].warnStock
          const externalCode = this.form.qualityTable[i].externalCode
          stockTotal = stockTotal + stock

          if (this.fromListPage === 31 && !wholesalePrice && this.form.ladderAuth === '0') {
            this.$message({
              type: 'error',
              message: '批发价不能为空'
            })
            return false
          }
          if (!this.$utils.isExist(price) && this.fromListPage === 30) {
            this.$message({ type: 'error', message: '商品规格价格不能为空' })
            return false
          }
          if (!this.$utils.isExist(stock)) {
            this.$message({ type: 'error', message: '商品库存不能为空' })
            return false
          }

          if (price && price.length > 14 && this.fromListPage === 30) {
            this.$message({
              type: 'error',
              message: '商品规格价格长度不能超过14个字节'
            })
            return false
          }
          if (stock.length > 8) {
            this.$message({
              type: 'error',
              message: '商品库存长度不能超过8个字节'
            })
            return false
          }
          if (externalCode === '') {
            this.$message({ type: 'error', message: '外部编码不能为空' })
            return false
          }

          // 正则表达式佣金判断
          const reg2 = /(^[1-9](\d+)?(\.\d{1,2})?$)|(^0$)|(^\d\.\d{1,2}$)/
          const pattern2 = new RegExp(reg2)
          if (!pattern2.test(price) && this.fromListPage === 30) {
            this.$message({ type: 'error', message: '请正确输入零售价' })
            return false
          }
          // 正则表达式校验
          if (this.$utils.isExist(warnStock)) {
            const reg3 = /^[0-9]*[1-9][0-9]*$/
            const pattern3 = new RegExp(reg3)
            if (!pattern3.test(warnStock)) {
              this.$message({ type: 'error', message: '请正确输入预警库存' })
              return false
            }
          }
          if (total1 * 1 > price * 1) {
            this.$message({
              type: 'error',
              message: '分销金额不能大于每个规格的价格'
            })
            return false
          }
          if (distributeType === 2) {
            const distributeFee = !this.form.distributeFee
              ? 0
              : this.form.distributeFee * 1
            if (distributeFee > price * 1) {
              this.$message({
                type: 'error',
                message: '微客佣金不能大于每个规格的价格'
              })
              return false
            }
            const shareMemberFee = !this.form.shareMemberFee
              ? 0
              : this.form.shareMemberFee * 1
            if (shareMemberFee > price * 1) {
              this.$message({
                type: 'error',
                message: '顾客分销佣金不能大于每个规格的价格'
              })
              return false
            }
            if (distributeFee + shareMemberFee > price * 1) {
              this.$message({
                type: 'error',
                message: '微客佣金+顾客分销佣金不能大于每个规格的价格'
              })
              return false
            }
          }
        }

        // 正则表达式校验
        const reg = /^[0-9]*[1-9][0-9]*$/
        const pattern = new RegExp(reg)
        if (!pattern.test(stockTotal)) {
          this.$message({ type: 'error', message: '请正确输入库存' })
          return false
        }
      }
      // 校验阶梯价
      if (this.ladderPriceList && this.ladderPriceList.length > 0) {
        if (!Number(this.ladderPriceList[0].ladderNum) > 0) {
          this.$message({
            type: 'error',
            message: '购买数量要大于0'
          })
          this.ladderAuthFlag = true
          return false
        }
        if (!parseFloat(this.ladderPriceList[0].ladderPrice) > 0) {
          this.$message({
            type: 'error',
            message: '批发价要大于0'
          })
          this.ladderAuthFlag = true
          return false
        }
      }
      if (this.ladderPriceList && this.ladderPriceList.length > 1) {
        for (let i = 0; i < this.ladderPriceList.length - 1; i++) {
          if (!Number(this.ladderPriceList[i + 1].ladderNum) > 0) {
            this.$message({
              type: 'error',
              message: '购买数量要大于0'
            })
            return
          }
          if (!parseFloat(this.ladderPriceList[i + 1].ladderPrice) > 0) {
            this.$message({
              type: 'error',
              message: '批发价要大于0'
            })
            return
          }
          if (Number(this.ladderPriceList[i].ladderNum) >= Number(this.ladderPriceList[i + 1].ladderNum)) {
            this.$message({
              type: 'error',
              message: '购买数量要大于上一级阶梯'
            })
            this.ladderAuthFlag = true
            return false
          }
          if (parseFloat(this.ladderPriceList[i].ladderPrice) <= parseFloat(this.ladderPriceList[i + 1].ladderPrice)) {
            this.$message({
              type: 'error',
              message: '批发价要小于上一级阶梯'
            })
            this.ladderAuthFlag = true
            return false
          }
        }
      }
      this.form.ladderPriceList = JSON.parse(
        JSON.stringify(this.ladderPriceList)
      )
      return true
    }
  }
}
</script>

<style lang="less" scoped>
.table-container {
  min-height: auto;
}

.quality-bar {
  background: #f2f2f2;
  border: #e4e4e4 1px solid;
  padding: 10px;

  .close-quality {
    color: #515151;
  }

  .close-sub {
    color: #aeaeae;
    position: absolute;
    right: -6px;
    top: -6px;
    font-size: 18px;
  }

  .qta-item:before {
    content: '';
    position: absolute;
    left: 12px;
    top: 34px;
    width: 1px;
    height: 46px;
    background: #bcbcbc;
  }

  .qta-item:after {
    content: '';
    position: absolute;
    left: 12px;
    top: 79px;
    width: 19px;
    height: 1px;
    background: #bcbcbc;
  }
}

.span-bar {
  padding: 0 50px;
}

.remove-btn {
  padding: 7px 6px !important;
}

.long-input {
  width: 80%;
}

.long-input-2 {
  width: 55%;
  margin-right: 5%;
}

.long-input-3 {
  width: 55%;
}

.short-input {
  width: 20%;
}

.short-input-2 {
  width: 25%;
}

.default-input {
  width: 80%;
  @media screen and (max-width: 1440px) {
    width: 100%;
  }
}

.tips {
  color: gray;
  font-size: 12px;
  line-height: 1.2;
  padding-top: 5px;
}

.picture {
  width: 130px;
  height: 130px;
  display: block;
}

.pic-bar {
  position: relative;

  .close-icon {
    position: absolute;
    right: -30px;
    top: -11px;
    width: 31px;
    height: 40px;
    padding: 0 7px;
    cursor: pointer;
  }

  span {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 100%;
    display: block;
    color: #fff;
    text-align: center;
    padding: 3px 0;
    background: rgba(0, 0, 0, 0.5);
    cursor: pointer;
  }
}

.pic-add {
  background: #fff;
  border: #d3d3d3 1px dashed;
  border-radius: 5px;
  padding: 0 45px;
}

.input-bar-0 {
  width: 35% !important;
}

.input-bar-1 {
  width: 40%;
  margin-bottom: 5px !important;
}

.input-bar-2 {
  width: 60%;
  margin-bottom: 5px !important;
}

.input-bar-3 {
  width: 100%;
  margin-bottom: 5px !important;
}

.input-bar-4 {
  width: 35% !important;
}

.width-input-1 {
  width: 100% !important;
}

.width-input-2 {
  width: 35% !important;
}

.width-input-3 {
  width: 30% !important;
}

.width-date {
  width: 200px !important;
}

.gray-bar {
  background: #fff;
  padding: 5px 0 0 0;
  margin-bottom: 20px;
}

.gray-active {
  margin-right: 20px;
  // padding: 15px 13px;

  &.active {
    background: #fff;
  }
}

.radio-top-bar {
  margin-bottom: -22px;
  .default-input {
    min-width: 600px;
  }
  /deep/ .el-input-group__append, .el-input-group__prepend{
    padding: 0 10px;
  }
}

.noraml-height {
  height: 40px;
}
.border-d7 {
  /deep/ .el-input__inner {
    padding: 0;
    padding-left: 10px;
  }
}
</style>
